function $key(getkeys) {
    return document.querySelector(getkeys);
}


var top = document.getElementsByClassName("top")[0];
var nav = document.getElementsByClassName("nav")[0];
// 提取日期相关函数
date();
function date() {
    var spa = document.querySelector(".dater");
    var timer = null;
    // 封装时间日期格式化
    function mydate() {
        var date = new Date();
        // 时间日期格式化 yyyy-mm-dd hh:mm:ss
        var year = date.getFullYear();
        var month = date.getMonth() + 1;
        var data = date.getDate();
        var hours = date.getHours();
        var minutes = date.getMinutes();
        var seconds = date.getSeconds();
        // 补 0
        month = (month < 10) ? "0" + month : month;
        data = (data < 10) ? "0" + data : data;
        hours = (hours < 10) ? "0" + hours : hours;
        minutes = (minutes < 10) ? "0" + minutes : minutes;
        seconds = (seconds < 10) ? "0" + seconds : seconds;
        var res = `${year}年${month}月${data}日 ${hours}:${minutes}:${seconds}`;
        return res;
    }

    function automove() {
        spa.innerHTML = mydate();
    }
    // 自动走
    setInterval(automove, 1000);
}
var username = sessionStorage.getItem('userAccount');
document.querySelector('.namer').textContent = username;


// 班级列表
var pageIndex = 1;
var pageSize = 5;
var Tbody = document.querySelector(".Tbody");
function mov() {
    Tbody.innerHTML = "";
    var data = {
        pageIndex: pageIndex,
        pageSize: pageSize,
        // clazzName:inp1.value,
        // time1:inp2.value,
        // time2:inp3.value,   
    }
    ajax.post("http://192.168.199.101:8080/BaorSystem/clazz/clazzList", data, function (res) {
        if (res.code == 200) {

            clazzList = res.dataset.clazzList;
            for (var i in clazzList) {
                var newTr = document.createElement("tr");
                newTr.innerHTML = `
                        <td>${clazzList[i].clazzId}</td>
                        <td>${clazzList[i].clazzName}</td>
                        <td>${clazzList[i].clazzNum}</td>
                        <td>${clazzList[i].startTime}</td>
                        <td>${clazzList[i].endTime}</td>
                        <td>${clazzList[i].clazzLeader}</td>
                        <td>${clazzList[i].clazzStatus}</td>
                        <td><button class="revis">修改</button></td>
                        <td><button class="detai">详情</button></td>
                    `;
                Tbody.appendChild(newTr);
            }
            pageCount = res.dataset.pageCount;
            var fot = document.querySelector(".fot");
            fot.innerHTML = "";
            for (var i = 1; i <= pageCount; i++) {
                var But = document.createElement("button");
                But.innerText = i;
                But.className = "page";
                fot.appendChild(But);
                Page();
            }
            revise();
            detail();
        }
    })

}
mov();


// 总班级上一页
var first = document.querySelector(".first");
var last = document.querySelector(".last");
first.onclick = function () {
    pageIndex--;
    if (pageIndex <= 1) {
        pageIndex = 1;
        this.disabled = true;
    }
    last.disabled = false;
    mov();
}


// 总班级下一页
last.onclick = function () {
    pageIndex++;
    if (pageIndex >= pageCount) {
        pageIndex = pageCount;
        this.disabled = true;
    }
    first.disabled = false;
    mov();
    // sou();
}


//页码点击
function Page() {
    var page = document.getElementsByClassName("page");
    for (var j = 0; j < page.length; j++) {
        page[j].onclick = function () {
            for (var i = 0; i < page.length; i++) {
                if (this == page[i]) {
                    pageIndex = i + 1;
                    console.log(page[i]);
                    page[i].style.backgroundColor = "blue";
                    page[i].style.color = "#fff";
                    mov();
                } else {
                    page[i].style.backgroundColor = "#fff";
                    page[i].style.color = "#000";
                }
            }

        }
    }
}


// 点击搜索，执行搜索列表
var inp1 = document.getElementsByClassName("inp1")[0];
var inp2 = document.getElementsByClassName("inp2")[0];
var inp3 = document.getElementsByClassName("inp3")[0];
var searchBtn = document.getElementsByClassName("searchBtn")[0];
searchBtn.onclick = function () {
    // mov();
    // 调搜索列表的接口
    sou();
}
function sou() {
    Tbody.innerHTML = "";
    var data = {
        pageIndex: pageIndex,
        pageSize: pageSize,
        clazzName: inp1.value,
        time1: inp2.value,
        time2: inp3.value,
    }
    ajax.post("http://192.168.199.101:8080/BaorSystem/clazz/clazzList", data, function (res) {
        console.log("收缩班级班级列表", res);
        if (res.code == 200) {
            clazzList = res.dataset.clazzList;
            pageCount = res.dataset.pageCount;
            console.log(pageCount);
            for (var item of clazzList) {
                var newTr = document.createElement("tr");
                newTr.innerHTML = `
                            <td>${item.clazzId}</td>
                            <td>${item.clazzName}</td>
                            <td>${item.clazzNum}</td>
                            <td>${item.startTime}</td>
                            <td>${item.endTime}</td>
                            <td>${item.clazzLeader}</td>
                            <td>${item.clazzStatus}</td>
                            <td><button class="revis">修改</button></td>
                            <td><button class="detai">详情</button></td>
                        `;
                Tbody.appendChild(newTr);

            }
            var fot = document.querySelector(".fot");
            fot.innerHTML = "";
            for (var i = 1; i <= pageCount; i++) {
                var But = document.createElement("button");
                But.innerHTML = i;
                But.className = "page";
                fot.appendChild(But);
            }
            revise();
            detail();
        }
    })
}


// 添加班级模态框
var Img = document.getElementsByClassName("Img")[0];
Img.onclick = function () {
    var Masks = document.createElement("div");
    Masks.className = "Masks";
    $key(".nav_content").insertBefore(Masks, $key(".nav_content").firstElementChild);
    var Modal = document.createElement("div");
    Modal.className = "Modal";
    Modal.innerHTML = `
        <div class="wtp">添加班级</div>
        <div class="wto">
            <div>班级名称：<input class="cst1" type="text"></div>
            <div>开始时间：<input  class="cst2" type="date"></div>
             <div>班级负责人：<select class="charg"></select></div>
           <div>结束时间： <input class="cst3" type="date"></div>
           
        </div>
        <div class="wtf">
            <button class="Confir">确认</button>
            <button class="Cance">取消</button>
        </div>
    `
    $key(".nav_content").insertBefore(Modal, $key(".nav_content").firstElementChild.nextSibling);
    charge();
    Confirm();
    Cancel();
}


//班级负责人
function charge() {
    var charg = document.querySelector(".charg");
    ajax.post("http://192.168.199.101:8080/BaorSystem/clazz/clazzLeader", {}, function (res) {
        if (res.code == 200) {
            var dataset = res.dataset;
            for (var i = 0; i < dataset.length; i++) {
                var newoption = document.createElement("option");
                newoption.innerHTML = `${dataset[i].userName}`;
                newoption.value = `${dataset[i].userId}`
                charg.appendChild(newoption);
            }

        }
    })
}


//添加班级 - 确认
function Confirm() {
    var Masks = document.querySelector(".Masks");
    var Modal = document.querySelector(".Modal");
    var Confir = document.getElementsByClassName("Confir")[0];
    Confir.onclick = function () {
        var cst1 = document.getElementsByClassName("cst1")[0];
        var cst2 = document.getElementsByClassName("cst2")[0];
        var cst3 = document.getElementsByClassName("cst3")[0];
        var charg = document.querySelector(".charg");
        console.log(charge.value);
        var slt = {
            clazzName: cst1.value,
            startTime: cst2.value,
            endTime: cst3.value,
            clazzLeader: Number(charg.value),
        }
        ajax.post("http://192.168.199.101:8080/BaorSystem/clazz/addClazz", slt, function (res) {

        })
        $key(".nav_content").removeChild(Masks);
        $key(".nav_content").removeChild(Modal);
        mov();
    }
}


//添加班级 - 取消
function Cancel() {
    var Cance = document.getElementsByClassName("Cance")[0];
    var Masks = document.querySelector(".Masks");
    var Modal = document.querySelector(".Modal");
    Cance.addEventListener("click", function () {
        $key(".nav_content").removeChild(Masks);
        $key(".nav_content").removeChild(Modal);
    })
}


// 修改
function revise() {
    var revis = document.getElementsByClassName("revis");
    for (var i = 0; i < revis.length; i++) {
        revis[i].onclick = function () {
            for (var j = 0; j < revis.length; j++) {
                if (this == revis[j]) {
                    var clazzid = clazzList[j].clazzId;
                    console.log();
                    var Masks = document.createElement("div");
                    Masks.className = "Masks";
                    $key(".nav_content").insertBefore(Masks, $key(".nav_content").firstElementChild);
                    var Modal = document.createElement("div");
                    Modal.className = "Modal";
                    Modal.innerHTML = `
                            <div class="wtp">添加班级</div> 
                            <div class="wto">
                                <div>班级名称：<input class="cs1" type="text"></div>
                                <div>开始时间：<input  class="cs2" type="date"></div>
                                <div>班级负责人：<select class="charg"></select></div>
                            <div>结束时间： <input class="cs3" type="date"></div>
                            </div>
                            <div class="wtf">
                                <button class="Confirr">确认</button>
                                <button class="Cance">取消</button>
                            </div>
                            `
                    $key(".nav_content").insertBefore(Modal, $key(".nav_content").firstElementChild.nextSibling);
                    charge();
                    Cancel();
                    //确认
                    var Masks = document.querySelector(".Masks");
                    var Modal = document.querySelector(".Modal");
                    var Confirr = document.getElementsByClassName("Confirr")[0];
                    Confirr.onclick = function () {
                        var cs1 = document.getElementsByClassName("cs1")[0];
                        var cs2 = document.getElementsByClassName("cs2")[0];
                        var cs3 = document.getElementsByClassName("cs3")[0];
                        var charg = document.querySelector(".charg");
                        var slt = {
                            clazzName: cs1.value,
                            startTime: cs2.value,
                            endTime: cs3.value,
                            clazzLeader: Number(charg.value),
                            clazzId: clazzid,
                        }
                        ajax.post("http://192.168.199.101:8080/BaorSystem/clazz/updateClazz", slt, function (sur) {
                            if (sur.code == 200) {
                                console.log(sur);
                            }
                        })
                        $key(".nav_content").removeChild(Masks);
                        $key(".nav_content").removeChild(Modal);
                    }
                }
            }
        }
    }
}


//详情
function detail() {
    var detai = document.getElementsByClassName("detai");
    for (var i = 0; i < detai.length; i++) {
        detai[i].onclick = function () {
            for (var j = 0; j < detai.length; j++) {
                if (this == detai[j]) {
                    var clazzid = clazzList[j].clazzId;
                    localStorage.setItem("classId", clazzid)
                    location.href = "Classdetails.html";
                }
            }
        }
    }
}


//页面跳转
//日志系统
var journal = document.getElementsByClassName("journal")[0];
journal.onclick = function () {
    location.href = "./diary.html";
}
//审核系统
var vet = document.getElementsByClassName("vet")[0];
vet.onclick = function () {
    location.href = "./audit.html";
}
//用户管理
var user = document.getElementsByClassName("user")[0];
user.addEventListener('click', function () {
    location.href = "./UserMage.html";
});
//班级管理
var classs = document.getElementsByClassName("classs");
classs[0].onclick = function () {
    location.href = "./ClassManagement.html";
}
//日常
var routine = document.getElementsByClassName("routine")[0];
routine.onclick = function () {
    location.href = "./daily.html";
}
//学生档案
var archives = document.getElementsByClassName("archives")[0];
archives.onclick = function () {
    location.href = "./student file.html";
}
//项目管理
var project = document.getElementsByClassName("project")[0];
project.onclick = function () {
    location.href = "./projectmanagement.html";
}
//出差记录
var travel = document.querySelector(".travel");
travel.addEventListener('click', function () {
    location.href = "./business.html";
});
//请假记录
var excused = document.querySelector(".excused");
excused.addEventListener('click', function () {
    location.href = "./vacate.html";
});
//考勤记录
var presence = document.querySelector(".presence");
presence.addEventListener('click', function () {
    location.href = "./clock.html";
});